<!--
 * @Author: 码上talk|RC
 * @Date: 2021-08-04 17:34:56
 * @LastEditTime: 2021-08-31 13:41:23
 * @LastEditors: 码上talk|RC
 * @Description: 
 * @FilePath: /ma-portal/components/select/index.vue
 * @微信:  13680065830
 * @邮箱:  3189482282@qq.com
 * @oops: Just do what I think it is right
-->
<template>
  <view class="axq-select">
    <a-input :value="value" :placeholder="placeholder" :placeholder-class="placeholderClass" disabled @tap="handleTap">
    </a-input>
    <text v-if="value && clearable" class="iconfont" @tap.native.stop="clear">&#xe62f;</text>
    <text v-else class="iconfont">&#xe62c;</text>
  </view>
</template>

<script>
  export default {
    components: {},
    mixins: [],
    props: {
      value: [String, Boolean, Number],
      disabled: Boolean,
      clearable: {
        type: Boolean,
        defalut: true
      },
      placeholder: String,
      placeholderClass: String
    },
    data() {
      return {
        cpnValue: ''
      }
    },
    methods: {
      clear(e) {
        e.stopPropagation()
        e.preventDefault()
        this.$emit('input', '')
        return false
      },
      handleTap() {
        this.$emit('tap')
        this.$emit('click')
      }
    }
  }
</script>

<style lang="less">
  .axq-select {
    .flexLayout(@a: center);
    border-radius: 4rpx;

    a-input {
      flex: 1;

      .axq-input {
        border: none !important;
      }
    }

    .iconfont {
      padding-right: 20rpx;
      font-size: 50rpx;
      color: #6f6d6d;

      &:active {
        filter: brightness(.8);
      }
    }

    &:active {
      filter: brightness(.8);
    }
  }
</style>